/*
 * @Author: thl
 * @Date: 2023-06-26 10:12:14
 * @FilePath: \cw_web\gl\src\views\dataBoard\components\card.jsx
 * @Descripttion:
 */
import React, { Component } from "react";
import { Card, Space, Statistic, Tooltip } from 'antd';
import {
    QuestionCircleFilled, ArrowUpOutlined, ArrowDownOutlined
} from '@ant-design/icons';
import "../style/card.less";


class DataCard extends Component {

    state = {
        num: 1
    }
    render() {
        const { top, showArr, } = this.props
        let show = showArr ? showArr : []
        return <Space direction="vertical" size={8} style={{
            marginBottom: 10,
        }}>
            {!show.includes(top.title) &&
                <Card
                    title={<div style={{ whiteSpace: "normal" }}>{top.title}</div>}
                    headStyle={{ whiteSpace: "normal" }}
                    style={{ cursor: "pointer", minWidth: 220 }}
                    extra={<Tooltip title={top.explain}><QuestionCircleFilled /></Tooltip>}
                >
                    <div className="cardNum">
                        {top.value}
                    </div>
                    {!top.yesterdayShow && <div className="yesterdayData">
                        <span>{top.nowData === true ? "较前一日" : "环比"}</span>
                        <Statistic
                            value={!!top.yesterday && Number(top.yesterday) !== 0 ? (Number(top.yesterday) / 100).toString() : 0}
                            precision={2}
                            valueStyle={{
                                color: top.yesterday ? top.yesterday.indexOf("-", 0) !== -1 ? '#3f8600' : '#cf1322' : "#000",
                            }}
                            prefix={!!top.yesterday && Number(top.yesterday) !== 0 ? (Number(top.yesterday) / 100).toString().indexOf("-", 0) !== -1 ? <ArrowDownOutlined /> : <ArrowUpOutlined /> : ""}
                            suffix={Number(top.yesterday) === 0 ? "" : "%"}
                        />
                    </div>}

                </Card>}
        </Space >
    }
}

export default DataCard;
